<template>
	<view class="">
		<view class="title">功能页面</view>
		<view class="list">
			<button @click="$router.push('/pages/login/index')">登录</button>
			<button @click="$router.push('/pages/native/page')">页面设置</button>
			<button @click="$router.push('/pages/native/interactive')">页面交互</button>
			<button @click="$router.push('/pages/native/form')">表单元素</button>
		</view>
		<view class="title">菜单栏设置</view>
		<view class="list">
			<button @click="handleEvent1">设置指定菜单项小红点</button>
			<button @click="handleEvent2">隐藏指定菜单项小红点</button>
			<button @click="handleEvent3">设置指定菜单项角标</button>
			<button @click="handleEvent4">设置指定菜单项角标</button>
			<button @click="handleEvent5">设置菜单栏样式</button>
			<button @click="handleEvent6">设置指定菜单项样式</button>
			<button @click="handleEvent7">隐藏菜单栏</button>
			<button @click="handleEvent8">显示菜单栏</button>
		</view>
	</view>
</template>

<script>
	
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
		},
		methods: {
			handleEvent1(){
				wx.showTabBarRedDot({ index:1 })
			},
			handleEvent2(){
				wx.hideTabBarRedDot({ index:1 })
			},
			handleEvent3(){
				wx.setTabBarBadge({ index: 0, text:'真' })
			},
			handleEvent4(){
				wx.removeTabBarBadge({ index: 0 })
			},
			handleEvent5(){
				wx.setTabBarStyle({
				  color: '#FF0000',
				  selectedColor: '#00FF00',
				  backgroundColor: '#0000FF',
				  borderStyle: 'white'
				})
			},
			handleEvent6(){
				wx.setTabBarItem({
				  index: 0,
				  text: 'text',
				  iconPath: '/path/to/iconPath',
				  selectedIconPath: '/path/to/selectedIconPath'
				})

			},
			handleEvent7(){
				wx.hideTabBar()
			},
			handleEvent8(){
				wx.showTabBar({ animation: true })
			},
		}
	}
</script>

<style lang="scss" scoped>
</style>
